<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			input{
				width: 450px;
				cursor: default;
				text-align: right;
				height: 30px;
			}
			button{
				width: 75px;
				margin:3px 9px;
				height: 30px;
			}
		</style>
	</head>
	<body>
		<!-- 
		 1、使用js创建页面
		 2、完成计算器的逻辑
		 -->
		<input class="srk" type="text" value="0" readonly="readonly" autocomplete="off"> 
		<div id="div" class="keys"></div>
		
		<script>
			// 获取标签
			var srk = document.querySelector(".srk")
			var keys = document.querySelector(".keys")
			// 使用js初始化页面：生成计算器的按键
			var keysArr = ["0","1","2","3","4","5","6","7","8","9",".","=","+","-","*","/","AC","sin","cos","tan","asin","acos","atan","ln"]
			
			// 循环数组，生成按键
			for(var i in keysArr){
				keys.innerHTML = keys.innerHTML + `<button>${keysArr[i]}</button>`
				// 隔5换行
				if(i>0 && (+i+1)%5==0){
					keys.innerHTML = keys.innerHTML + "<br/>"
				}
			}
			
			// 定义三个变量 ： 存储计算结果（初始值0）a  存储按的数字b 存储计算的计算付（计算方式）c
			// 给所有的按钮 添加点击事件
			// 获取所有的按键
			var buttons = document.querySelectorAll("button");//[{},{},{}]
			var a = "0";
			var b = "0";
			var c = "+"
			
			// 绑定按钮的点击事件
			for(var i in buttons){
				buttons[i].onclick = function(){
					var inner = this.innerHTML
					
					if(inner=="0" || inner == "1" || inner == "2" || inner == "3" || inner == "4" || inner == "5" || inner == "6" || inner == "7" || inner == "8" || inner == "9"){
						if(b=="0"){
							b = inner;
						}else{
							b += inner;
						}
						
						srk.value = b;
					}else if(inner == "."){
						if(b.indexOf(".") == -1){
							b += inner
						}
					}else if(inner == "+" || inner == "-" || inner == "*" || inner == "/"){
						a = b;
						b = "0"
						c = inner;
						console.log(a,b)
						
					}else if(inner == "sin"){
						var inp = srk.value;
						var aaa =Math.sin(inp)
						console.log(aaa)
					}else if(inner == "cos"){
						var inp = srk.value;
						var aaa =Math.cos(inp)
						console.log(aaa)
					}else if(inner == "tan"){
						var inp = srk.value;
						var aaa =Math.tan(inp)
						console.log(aaa)
					}else if(inner == "asin"){
						var inp = srk.value;
						var aaa =Math.asin(inp)
						console.log(aaa)
					}else if(inner == "acos"){
						var inp = srk.value;
						var aaa =Math.acos(inp)
						console.log(aaa)
					}else if(inner == "atan"){
						var inp = srk.value;
						var aaa =Math.atan(inp)
						console.log(aaa)
					}else if(inner == "ln"){
						var inp = srk.value;
						var aaa =Math.log(inp)
						console.log(aaa)
					}else if(inner == "="){
						a = eval(a+c+b)
						srk.value = a;
						b = a
					}else{
						a = "0"
						b = "0"
						c = "+"
						srk.value = a
					}
					// 如果是数字键---操作b
					// 如果是 + - * / 操作 c  ===    等待 =
					// 如果是三角函数 ，操作c --- 直接出结果 ---- = 也出结果
					
					//如果是= 计算
					// 如果是AC ,全部初始化
				}
			}
			
		</script>
	</body>
</html>
